/**
* 需求申请
*/
<template>
    <vp-main-page @refresh="loadDataList" :tableRef="tableRef">
        <template #search>
            <el-form ref="searchFormRef" :model="searchForm" @submit.prevent @keyup.enter="loadDataList"
                label-width="120px">
                <vp-search-row :show-more="showMore">
                    <vp-search-col>
                        <el-form-item prop="bt">
                            <template #label><vp-label zh="标题" en="Title" /></template>
                            <el-input v-model="searchForm.bt" v-trim></el-input>
                        </el-form-item>
                    </vp-search-col>
                    <vp-search-col>
                        <el-form-item>
                            <template #label><vp-label zh="适用机型" en="Applicable AC Type" /></template>
                            <BasedataModelSelectDialog v-model:value="searchForm.acTypeList"
                                @basedataModelSelected="basedataModelSelectedHandle" />
                        </el-form-item>
                    </vp-search-col>
                    <vp-search-col>
                        <el-form-item prop="bb">
                            <template #label><vp-label zh="版本" en="Rev." /></template>
                            <el-select class="w100" v-model="searchForm.bb" clearable collapse-tags>
                                <el-option :value="1" label="生效/Effect"></el-option>
                                <el-option :value="2" label="最新/Latest"></el-option>
                            </el-select>
                        </el-form-item>
                    </vp-search-col>
                    <vp-search-col>
                        <el-form-item prop="ztList">
                            <template #label><vp-label zh="状态" en="Status" /></template>
                            <el-select class="w100" v-model="searchForm.ztList" clearable multiple collapse-tags>
                                <el-option :value="10" label="保存 Save"></el-option>
                                <el-option :value="88" label="审批中 Processing"></el-option>
                                <el-option :value="89" label="已审批 Processed"></el-option>
                                <el-option :value="98" label="作废 Invalid"></el-option>
                            </el-select>
                        </el-form-item>
                    </vp-search-col>

                    <vp-search-col>
                        <el-form-item prop="bh">
                            <template #label><vp-label zh="编号" en="No." /></template>
                            <el-input v-model="searchForm.bh" v-trim></el-input>
                        </el-form-item>
                    </vp-search-col>
                    <vp-search-col>
                        <el-form-item :label-width="120" prop="yjbs">
                            <el-checkbox v-model="searchForm.yjbs" :true-value="1" :false-value="0">
                                <vp-label zh="仅看预警数据" en="Only Warning Data" />
                            </el-checkbox>
                        </el-form-item>
                    </vp-search-col>
                    <vp-search-col btn-col>
                        <vp-btn-search :loading="loading" @click="loadDataList" />
                        <vp-btn-reset @click="handleSearchReset" />
                        <vp-btn-more @change="showMore = $event" />
                    </vp-search-col>
                </vp-search-row>
            </el-form>
        </template>
        <template #actions>
            <vp-btn-add v-auth="'projectTechBulletin.edit'" @click="handleAdd" />
        </template>
        <template #table>
            <vp-vxe-table id="baseDataModel" ref="tableRef" :data="tableData" row-key="id" v-loading="loading">
                <vxe-column type="seq" align="center" title="#" width="50" />
                <vxe-column field="zt" show-overflow width="160">
                    <template #header><vp-label zh="状态" en="Status" /></template>
                    <template #default="scope">
                        {{
        scope.row.zt === 10 ? '草稿 Draft' :
            scope.row.zt === 88 ? '审批中 Processing' :
                scope.row.zt === 89 ? '生效/Effect' :
                    scope.row.zt === 98 ? '作废 Invalid' : ''
    }}
                    </template>
                </vxe-column>
                <vxe-column field="bh" show-overflow width="160">
                    <template #header><vp-label zh="编号" en="No." /></template>
                </vxe-column>
                <vxe-column field="bb" show-overflow width="160">
                    <template #header><vp-label zh="版本" en="Rev." /></template>
                </vxe-column>
                <vxe-column field="bt" show-overflow width="">
                    <template #header><vp-label zh="标题" en="Title" /></template>
                </vxe-column>
                <vxe-column field="jx" show-overflow width="200">
                    <template #header><vp-label zh="机型" en="Applicable AC Type" /></template>
                </vxe-column>
                <vxe-column field="bfrq" show-overflow width="160">
                    <template #header><vp-label zh="颁发日期" en="Issue Date" /></template>
                </vxe-column>
                <vxe-column field="sxrq" show-overflow width="160">
                    <template #header><vp-label zh="⽣效⽇期" en="Effective Date" /></template>
                </vxe-column>
                <vxe-column field="blqx" show-overflow width="160">
                    <template #header><vp-label zh="办理期限" en="Processing Period" /></template>
                </vxe-column>
                <vxe-column field="wcqx" show-overflow width="160">
                    <template #header><vp-label zh="完成期限" en="Deadline" /></template>
                </vxe-column>
                <vxe-column field="wcqx" show-overflow width="160">
                    <template #header><vp-label zh="传阅跟踪" en="Circulation Tracking" /></template>
                    <template #default="scope">
                        <el-link @click="handleCirculationTracking(scope.row)">0/1</el-link>
                    </template>
                </vxe-column>
                <vxe-column field="operation" title="操作 Operations" fixed="right" width="140">
                    <template #header><vp-label-operations /></template>
                    <template #default="scope">
                        <el-space>
                            <vp-btn-edit v-if="scope.row.zt == 10" v-auth="'projectTechBulletin.edit'" text
                                @click="handleEdit(scope.row)" />
                            <vp-btn-del v-if="scope.row.zt == 10" v-auth="'projectTechBulletin.edit'" text
                                @click="handleDelete(scope.row)" />
                            <vp-btn-view text @click="handleView(scope.row)" />
                        </el-space>
                    </template>
                </vxe-column>
            </vp-vxe-table>
        </template>

        <template #pagination>
            <vp-pagination @change="loadDataList" :total="page.total" v-model:currentPage="page.pageNum"
                v-model:pageSize="page.pageSize">
            </vp-pagination>
        </template>
        <!-- <EditProjectTechBulletin ref="commRef" @formSubmited="handleFormSubmited"></EditProjectTechBulletin> -->
        <ViewReception ref="viewReceptionRef"></ViewReception>
    </vp-main-page>
</template>
<script setup lang="ts" name="projectTechBulletin">
import { onMounted, reactive, ref, defineAsyncComponent } from 'vue'
import request from '/@/utils/request';
import { DEFAULT_PAGE } from '/@/utils/page';
import EditProjectTechBulletin from './component/EditProjectTechBulletin.vue';
import VpMessageBox from '/@/components/vp/VpMessageBox';
import VpDictSelect from '/@/components/vp/dict/VpDictSelect.vue';
import BasedataModelSelectDialog from '/@/components/vp/basedata/basedataModelSelectDialog.vue';
const ViewReception = defineAsyncComponent(() => import('./component/ViewReception.vue'));

import { useRouter } from 'vue-router';
const router = useRouter();


const searchForm = reactive({
    bh: '',
    ztList: [],
    jh: "",
    zwms: "",
    xqlb: "",
    dateList: [],
    yjbs: 0,
    bb: "",
    bt: "",
    acTypeList: [],
});

const page = reactive({
    ...DEFAULT_PAGE,
})

const showMore = ref(false);
const loading = ref(false);
const tableData = ref([]);


// 加载列表数据
const loadDataList = () => {
    loading.value = true
    request.get('/material/demand/pageList', {
        params: {
            ...searchForm,
            ...page
        }
    }).then(res => {
        tableData.value = res?.data?.list || []
        tableData.value = [{ zt: 10, bh: 20521561521, bb: "v1", bt: "dsfsd54fs2d145", jx: "fasd", bfrq: "2025 - 10 - 20", sxrq: "2025 - 10 - 20", blqx: "2025 - 10 - 20", wcqx: "2025 - 10 - 20", id: 1,f_bbid:2 }]
        page.total = res?.data?.total || 0
        page.pageNum = res?.data?.pageNum || 1;
    }).finally(() => {
        loading.value = false;
    })
}

const searchFormRef = ref();
// 重置搜索条件
const handleSearchReset = () => {
    searchForm.dateList = [];
    searchForm.ztList = [];
    searchForm.jh = "";
    searchForm.zwms = "";
    searchForm.bh = "";
    searchForm.xqlb = "";
    searchFormRef.value.resetFields();
    loadDataList();
}

onMounted(() => {
    loadDataList();
})

const commRef = ref();
const tableRef = ref();

const handleAdd = () => {
    // commRef.value.handleOpen({
    //     type: 'add'
    // });
    router.push({
        name: "addProjectTechBulletin",
    })
}

const handleEdit = (row: any) => {
    // commRef.value.handleOpen({
    //     type: 'edit',
    //     id: row.id
    // });
    router.push({
        name: "editProjectTechBulletin",
        params: {
            id: row.id,
        },
    })

}

const handleFormSubmited = () => {
    loadDataList();
}

const handleView = (row: any) => {
    router.push({
        name: "viewMaterialDemand",
        params: {
            id: row.id,
        },
    })
}

const viewReceptionRef = ref()
// 查看传阅情况
const handleCirculationTracking = (row: any) => {
    viewReceptionRef.value.handleOpen({
        id: row.id
    });
}

// 删除
const handleDelete = (row: any) => {
    VpMessageBox.confirmDelete().then(() => {
        loading.value = true;
        request.delete(`/material/demand/${row.id}`).then(res => {
            loadDataList();
        }).catch(() => { }).finally(() => {
            loading.value = false;
        })
    });
}

const basedataModelSelectedHandle = (data: any) => {
    searchForm.acTypeList = data;
}

</script>